﻿@model LoginModel
@{
    ViewBag.Title = "Value";
}

<h2>Value</h2>

<p>The value binding links the associated DOM element’s value with a property on your view model. This is typically useful with form elements such as &lt;input&gt;, &lt;select&gt; and &lt;textarea&gt;.</p>
<p><a href="http://knockoutjs.com/documentation/value-binding.html" target="_blank">http://knockoutjs.com/documentation/value-binding.html</a></p>

@Html.VisiTogglerFromPartial(CodeSamplePartials.VALUE_VIEW_MODEL, Html.CreateVisiToggler("show the samples view model C# source code ", htmlAttributes: new { @class = "onright" }, options: VisiOptions.HiddenByDefault))
<br />
@Html.VisiTogglerFromPartial(CodeSamplePartials.VALUE_CONTROLLER, Html.CreateVisiToggler("show the samples controller C# source code ", htmlAttributes: new { @class = "onright" }, options: VisiOptions.HiddenByDefault))


<h3>Sample #1</h3>

<p>Login name: <input @Html.KoAttrValue(m => m.UserName, KoValueUpdate.AfterKeyDown) /></p>
<p>Password: <input type="password" @Html.KoAttrValue(m => m.UserPassword) /></p>

<h5>Entered values:</h5>
<p>Login name (real-time updates): <span @Html.KoAttrText(m => m.UserName) ></span></p>
<p>Password (updates on focus change): <span @Html.KoAttrText(m => m.UserPassword) ></span></p>

@Html.VisiTogglerFromPartial(CodeSamplePartials.VALUE1, Html.CreateVisiToggler("show the sample source code ", htmlAttributes: new { @class = "onright" }, options: VisiOptions.HiddenByDefault))

<p>More is coming soon ...</p>

<p>&nbsp;</p>
<p>Next &gt; @Html.ActionLink("Checked", "Checked", "Examples")</p>

@Model.ApplyBindingsScript(KoBindingOptions.IncludeData)